// 定义自定义指令
export default {
    mounted(el, binding) {
      // 检查是否传入了回调函数
      if (typeof binding.value !== 'function') {
        console.warn('v-resize 指令需要一个回调函数作为参数');
        return;
      }
  
      // 创建 ResizeObserver 实例
      const resizeObserver = new ResizeObserver((entries) => {
        for (let entry of entries) {
          // 调用传入的回调函数，并传递宽高信息
          binding.value({
            width: entry.contentRect.width,
            height: entry.contentRect.height,
          });
        }
      });
  
      // 观察目标元素
      resizeObserver.observe(el);
  
      // 将 ResizeObserver 实例存储到元素上，方便在 unmounted 钩子中清理
      el._resizeObserver = resizeObserver;
    },
    unmounted(el) {
      // 停止观察并清理
      if (el._resizeObserver) {
        el._resizeObserver.disconnect();
        delete el._resizeObserver;
      }
    },
  };